<template>
   <div class="logins">
        <div class="logins_top">
            <div class="top_btn">
                <div class="back" @click="back">返回</div>
                <div class="goRegs" @click="goRegs">注册</div>
            </div>
        </div>
        <div class="reg_from" id="login_form">
            <div class="reg_form" id="reg_form">
                 <input type="text" class="phone" oninput = "value=value.replace(/[^\d]/g,'')" maxlength="11" @focus="view"  v-model.trim="phone" placeholder="请输入手机号"/>
                 <input type="password" class="reg_password" v-model.trim="password" placeholder="请输入密码(6位以上)" @focus="view" maxlength="12"/>
                 <input type="button" class="reg_button" @click="login" value="立即登录"/>
            </div>
        </div>        
   </div>     
</template>
<script>
export default {
   name: 'Login',
        data () {
            return {
                phone:'',
                password:"",
                inviteCode:"",
        }
    }, 
    created(){
        document.title="登录";
        if(this.$route.query.spread_code){
         this.inviteCode=this.$route.query.spread_code;
      }else{
          this.inviteCode="3Jbc4j";
      }
    }, 
    methods:{
            back(){
                this.$router.go(-1);
            },
            goRegs(){
                this.$router.push({path:'/regs',query:{spread_code:this.inviteCode}}); 
            },
            login(){
                if(this.phone==''){
                  Toast("请输入手机号码");
                  return false;
                }else if(this.password==''){
                    Toast("请输入密码");
                    return false;
                }
                this.$axios.post('/v1/common/login',{                  
                    mobile: this.phone,
                    login_type:'1',
                    password:this.password,
                }).then(res => {          
                    var result=res.data;
                    if(result.code==200){
                       var token=result.data.token;
                       localStorage.setItem('token',token);
                    //    this.$router.push({path:'/center'});
                       this.$router.push({path:'/redpocket',query:{spread_code:this.inviteCode,title:'整点红包'}});
                    }else{
                        Toast(result.msg)
                    }
                }, res => {
                    console.log("error");
                });
            },
            view(){
             let _this=this;
             setTimeout(function(){
                let pannel=document.getElementById("reg_form");
                pannel.scrollIntoView(true);
             },200)
          }
    }
}
</script>
<style scoped>
.logins{width:100%;height:100%;background:#FEEDD4;position:absolute;top:0;right:0;bottom:0;left:0;}
.logins_top{width:100%;height:836px;padding-top:36px;background:#FEEDD4 url("/static/img/regs.png") no-repeat center center;background-size:100% 100%;}
.top_btn{display: flex;justify-content: space-between;}
.back{background:#E1C4A0;width:120px;height:68px;border-radius:0 68px 68px 0;line-height:68px;text-align: center;font-size:28px;color: #FFF;}
.goRegs{background:#D6B38B;width:120px;height:68px;border-radius:68px 0 0 68px;line-height:68px;text-align: center;font-size:28px;color: #604F3A;}
#login_form{background:#FEEDD4;}
.reg_from .reg_form{width:700px;margin:0 auto;}
.reg_from .reg_form input{width:100%;height:100px;border:none;border-radius:94px;text-indent:36px;margin-bottom:26px;font-size:32px;color: #9D7E61;}
.reg_form .form_auth{  display: flex;
  flex-wrap: wrap;
  justify-content:space-between;
  justify-items: center;
  text-align: justify; }
.reg_form .auth_code{width:378px!important;}
.reg_form .get_code{width:280px!important;background:linear-gradient(270deg,rgba(81,85,91,1) 0%,rgba(29,27,43,1) 100%);
border-radius:47px;font-size:32px;color:#FFF;text-indent:0!important;cursor:pointer;outline:0px; -webkit-appearance:none;color: #FFF!important;}
.reg_form .reg_button{margin-top:14px;background:linear-gradient(90deg,rgba(81,85,91,1) 0%,rgba(29,27,43,1) 100%);
border-radius:47px;color:#1A0B33;font-size:36px;font-weight:500;cursor:pointer;outline:0px; -webkit-appearance:none;color: #FFF!important;}
</style>